<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="../js/jquery-1.8.3.js" ></script>
		<script>
			function hideFn(){
				//获取id为showDiv的标签
				/*$("#showDiv").hide("slow",function(){
					alert("动画结束了");
				})*/
				$("#showDiv").hide(3000,"linear");
			}
			function showFn(){
				//显示id为showDiv的标签
				//$("#showDiv").show("fast");
				$("#showDiv").show(3000);
			}
			function toggleFn(){
				//显示和隐藏切换
				$("#showDiv").toggle(3000);
			}
		</script>
	</head>
	<body>
		<input type="button" value="点击div隐藏" onclick="hideFn()"/>
		<input type="button" value="点击div显示" onclick="showFn()"/>
		<input type="button" value="点击div隐藏和显示切换" onclick="toggleFn()"/>
		<div id="showDiv" style="width: 300px;height: 300px;background-color: red;">
			div显示和隐藏
		</div>
	</body>
</html>
